/**
 *
 * Copyright 2016-present scrm
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 */
import React from 'react';
import { InteractionManager, StyleSheet, TextInput, View, Keyboard, ScrollView, Text } from 'react-native';

import AV from 'leancloud-storage';
import DeviceInfo from 'react-native-device-info';
import { createIconSetFromIcoMoon } from 'react-native-vector-icons';
import icoMoonConfig from '../../config/icoMoonConfig.json';
import colors from '../../config/colors';
const Icon = createIconSetFromIcoMoon(icoMoonConfig);
import { bindActionCreators } from 'redux';
import Badge from '../../components/Badge';
import { List } from 'antd-mobile-rn';
import listStyle from 'antd-mobile-rn/lib/list/style/index.native';
import { connect } from 'react-redux';
import store from 'react-native-simple-store';
import * as userCreators from '../../actions/user';

const freshlistStyle = {
  ...listStyle
}

const Item = List.Item;
const Brief = Item.Brief;

import {
  CLIENTS_ROUTE,
  FOLLOW_RECORD,
  CHA_CHONG,
  CHENGJIAO_CLIENTS_ROUTE,
  CLIENT_SEAS,
  INTEL_CLIENT_SEAS,
  SCAN_CODE,
  INVITE_CODE,
  H5_MARKETING,
  NEW_ROLLS,
  REASSIGN_CLIENTS,
  CHENGJIAO_REASSIGN_CLIENTS
} from '../../constants/VueRoutes';

let feedbackText;

class Marketing extends React.Component {
  static navigationOptions = ({ navigation }) => ({
    title: '普通营销',
    tabBarIcon: ({ tintColor }) => (
      <Badge show={false}>
        <Icon name="normalmarketing_n" size={24} color={tintColor} />
      </Badge>
    ),
    headerRight: null
  });

  constructor (props) {
    super(props);
    this.navigateToLink = this.navigateToLink.bind(this);
  }

  componentDidMount() {
    feedbackText = '';
    this.props.navigation.setParams({ handleCheck: this.onActionSelected });
    const { userActions } = this.props;
    InteractionManager.runAfterInteractions(() => {
      store.get('token')
        .then(token => {
          userActions.requestUser(token)
        })
    });
  };

  renderLeftGrid() {

  };

  async go (link) {
    try {
      const { navigate } = this.props.navigation;
      const url = await link();
      navigate('scrm', {
        article: {
          url: url,
          title: '',
        }
      });
    } catch(err) {
      console.log(err, 'err')
    }
  }

  navigateToLink (link ) {
    this.go(link)
  };

  renderManagerItems () {
    const { user } = this.props.user
    if (user && user.is_team_manager) {
      return (<List>
        <Item
        arrow="horizontal"
        thumb="https://fin.91mycloud.com/reassign-ico.png"
        multipleLine
        styles={styles}
        onClick={() => this.navigateToLink(REASSIGN_CLIENTS)}
        >
          团队潜在客户
        </Item>
        <Item
        arrow="horizontal"
        thumb="https://fin.91mycloud.com/team-custom-deal.png"
        multipleLine
        styles={styles}
        onClick={() => this.navigateToLink(CHENGJIAO_REASSIGN_CLIENTS)}
        >
          团队成交客户
        </Item>
      </List>)
    }

    return 
  }

  render() {
    return (
      <ScrollView style={styles.container}>
        <List styles={styles}>
          <Item
          arrow="horizontal"
          thumb="https://fin.91mycloud.com/myCustoms.png"
          multipleLine
          styles={styles}
          onClick={() => this.navigateToLink(CLIENTS_ROUTE)}
          >
            我的潜在客户
          </Item>
          <Item
          arrow="horizontal"
          thumb="https://fin.91mycloud.com/custom-deal.png"
          multipleLine
          styles={styles}
          onClick={() => this.navigateToLink(CHENGJIAO_CLIENTS_ROUTE)}
          >
            我的成交客户
          </Item>
          <Item
          arrow="horizontal"
          thumb="https://fin.91mycloud.com/clientSea.png"
          multipleLine
          styles={styles}
          onClick={() => this.navigateToLink(CLIENT_SEAS) }
          >
            客户公海
          </Item>
          <Item
          arrow="horizontal"
          thumb="https://fin.91mycloud.com/intelClientIco.png"
          multipleLine
          styles={styles}
          onClick={() => this.navigateToLink(INTEL_CLIENT_SEAS) }
          >
            智能公海
          </Item>
        </List>
        <List styles={styles}>
          <Item
          arrow="horizontal"
          thumb="https://fin.91mycloud.com/new_customs_ico.png"
          multipleLine
          styles={styles}
          onClick={() => this.navigateToLink(NEW_ROLLS)}
          >
            名单添加列表
          </Item>
          <Item
          arrow="horizontal"
          thumb="https://fin.91mycloud.com/chachongico.png"
          multipleLine
          styles={styles}
          onClick={() => this.navigateToLink(CHA_CHONG) }
          >
            查重
          </Item>
        </List>
        { this.renderManagerItems() }
      </ScrollView>
    )
  };
}

const styles = StyleSheet.create({
  ...listStyle,
  container: {
    flex: 1,
    flexDirection: 'column',
    backgroundColor: colors.grey9
  },
  textInput: {
    flex: 1,
    fontSize: 18,
    padding: 15,
    textAlignVertical: 'top'
  },
  GriditemWrapperStyle: {
    flexDirection: 'row'
  },
  multipleThumb: {
    ...listStyle.multipleThumb,
    width: 20,
    height: 20
  },
  Body: {
    ...listStyle.body,
    marginBottom: 10
  }
});

const mapStateToProps = (state) => {
  const { user, auth } = state;
  console.log('marketing mapStateToProps', user)
  return {
    user,
    auth
  };
};

const mapDispatchToProps = (dispatch) => {
  const userActions = bindActionCreators(userCreators, dispatch);
  return {
    userActions,
  };
};

export default connect(mapStateToProps, mapDispatchToProps)(Marketing);
